* {
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
  }
  html{
    height: 100%;
  }

  body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, div, dl, dt, dd, ul, ol, li, pre, form, fieldset, lengend, button, input, textarea, th, td {
    margin: 0;
    padding: 0;
  }

  /*body*/
  body {
    font: 14px "Microsoft YaHei", 微软雅黑, "Arail"; /* letter-spacing: 1px; */
    background: #f7f7f8;
    height: 100%;
    //overflow-y: scroll;
  }

  fieldset, img {
    border: 0;
  }

  ::-webkit-input-placeholder { /* WebKit browsers */
    color: #b2b2b2;
  }

  :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #b2b2b2;
  }

  ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #b2b2b2;
  }

  :-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #b2b2b2;
  }

  ::-ms-clear {
    display: none;
  }

  ::-ms-reveal {
    display: none;
  }

  .remove-scrollbar::-webkit-scrollbar {
    width: 0px
  }

  /*去除滚动条,依然可滚动*/
  input, button, select, textarea {
    outline: none;
  }

  ul, li {
    list-style-type: none;
  }

  a {
    text-decoration: none;
    color: $--color-primary;
  }

  a:active {
    opacity: 0.7;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    thead {
      font-size: 14px;
    }
  }

  /*链接样式*/
  .link-active:active {
    background: #f3f4f6;
  }

  .f-l { float: left; }
  .f-r {float: right;}

  .t-l {text-align: left;}
  .t-c {text-align: center;}
  .t-r {text-align: right;}

  .over-h {overflow: hidden;}
  .d-b {display: block;}
  .b-b-b {background-repeat: no-repeat; background-size: cover; background-position: center center;}
  .b-c-fff {background-color: #fff;}

  /*文本自动换行*/
  .pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
  }

  /*不换行*/
  .no-pre {
    white-space: nowrap;
  }

  /*文字太宽加....*/
  .add-dot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
  }

  .add-dot2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  /*运营*/
  @font-face {
    font-family: 'iconfont';  /* project id 1717462 */
    src: url('//at.alicdn.com/t/font_1717462_uvslgdmyzxh.eot');
    src: url('//at.alicdn.com/t/font_1717462_uvslgdmyzxh.eot?#iefix') format('embedded-opentype'),
    url('//at.alicdn.com/t/font_1717462_uvslgdmyzxh.woff2') format('woff2'),
    url('//at.alicdn.com/t/font_1717462_uvslgdmyzxh.woff') format('woff'),
    url('//at.alicdn.com/t/font_1717462_uvslgdmyzxh.ttf') format('truetype'),
    url('//at.alicdn.com/t/font_1717462_uvslgdmyzxh.svg#iconfont') format('svg');
  }
  .iconfont {
    font-family: "iconfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
  }

  /*团购*/
  @font-face {
    font-family: 'iconfont-tg';  /* project id 1717475 */
    src: url('//at.alicdn.com/t/font_1717475_orpplrm8rim.eot');
    src: url('//at.alicdn.com/t/font_1717475_orpplrm8rim.eot?#iefix') format('embedded-opentype'),
    url('//at.alicdn.com/t/font_1717475_orpplrm8rim.woff2') format('woff2'),
    url('//at.alicdn.com/t/font_1717475_orpplrm8rim.woff') format('woff'),
    url('//at.alicdn.com/t/font_1717475_orpplrm8rim.ttf') format('truetype'),
    url('//at.alicdn.com/t/font_1717475_orpplrm8rim.svg#iconfont') format('svg');
  }
  .iconfont-tg{
    font-family: "iconfont-tg" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
  }

  #app-body{
    height: 100%;
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50;
    min-width: 1000px;
    box-sizing: border-box;
  }
  
  #app {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  /*左边菜单*/
  #nav-menu-div {
    width: 180px;
    background-color: #20232C;
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    /*登录用户*/
    #login-username{
      height: 136px;
      text-align: center;
      border-bottom: 6px solid #171921;
      >.username-avatar{
        overflow: hidden;
        >img{
          margin: 28px auto 14px;
          display: block;
          border-radius: 50%;
        }
      }
      .username{
        color: #D1D4DB;
        font-size: 14px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        >.str{
          max-width: 130px;
        }
        >.icon{
          font-size: 12px;
          margin-left: 5px;
          position: relative;
          top: 1px;
        }
      }
    }
    /*菜单*/
    #menu-div{
      overflow-y: auto;
      overflow-x: hidden;
      flex: 1;
      &::-webkit-scrollbar {
        width: 0;
        height: 0;
        color: transparent;
      }
      i {
        color: #bbb;
      }

      li.el-submenu {
        background-color: #20232C !important;
        span {
          margin-left: 6px;
        }
        .el-menu--popup {
          width: 180px !important;
        }
        > .el-submenu__title:hover{
          background-color: #20232C !important;
          opacity: .7;
        }
      }
  
      li.el-menu-item {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        background-color: #20232C !important;
        width: 180px;
        span {
          margin-left: 4px;
        }
        &:hover{
          opacity: .7;
        }
        &.is-active {
          background-color: #101116 !important;
        }
      }
  
      .el-menu--horizontal {
        border-bottom: 0;
      }
    }

    /*进入团购*/
    #go-g-buy{
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 10px  0;
      >.btn{
        border: 1px solid #929AAC;
        width: 100px;
        height: 24px;
        line-height: 24px;
        text-align: center;
        color: #929AAC;
        border-radius: 4px;
        cursor: pointer;
        font-size: 12px;
        opacity: .7;
        &:hover{
          opacity: 1;
        }
      }
    }
  }

  /*页面容器*/
  #router-view-div {
    padding: 16px;
    min-width: 1000px;
    box-sizing: border-box;
    background-color: #f7f7f8;
    margin-left: 182px;
    .breadcrumb {
      padding: 0px 16px;
      /*background-color: #fff;*/
    }
    .query, .container-query {
      font-size: 12px;
      padding: 16px 16px;
      margin-bottom: 16px;
      background-color: #fff;
    }
    .operate {
      text-align: right;
      padding: 0 16px;
      margin-bottom: 16px;
    }
    .operate.space-between {
      display: flex;
      justify-content: space-between;
    }
    .footer {
      padding: 8px 20px;
      background-color: #fff;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  }

  /* 自定义form表单中，由自定义验证规则引发的, 添加必选标记！ */
  .required .el-form-item__label::before {
    content: '*';
    color: #f56c6c;
    margin-right: 4px;
  }

  /* 当宽度超过设定值时，自动换行 */
  .el-popover--plain {
    word-wrap: break-word;
  }

  /* 自定义状态标签tag的类名 regular */
  .el-tag--regular {
    color: #73767D !important;
    background-color: rgba(115, 118, 125, 0.15) !important;
    border-color: rgba(115, 118, 125, 0.25) !important;
  }

  /* 重绘 tabs 选项卡 在 type="border-card" 时的样式 */
  .custom-tabs {
    background: transparent !important;
    border: 0 !important;
    &.el-tabs--border-card {
      box-shadow: none !important;
      -webkit-box-shadow: none !important;
    }
    .el-tabs__content {
      padding: 0 !important;
    }
    .el-tabs__header {
      background-color: transparent !important;
      border-bottom: 0 !important;
      .el-tabs__item {
        border: 0 !important;
        font-size: 12px !important;
      }
    }
  }

  .subtitle{
    color: #5A5D64;
    margin-left: 30px;
    font-size: 14px;
    margin-bottom: 16px;
  }

  .custom-form{
    width: 90%;
    max-width: 1400px;
    .el-form-item__label{
      color: #909399 !important;
      font-size: 14px !important;
    }
    .el-form-item__content{
      .el-input, .el-date-editor{
        position: relative;
        top: -4px;
      }
    }
  }

  .custom-form-operating-config{
    .el-form-item__label {
      color: #73767D !important;
      font-size: 12px !important;
    }
  }

  .custom-form-detail {
    .el-form-item__label{
      color: #909399 !important;
      font-size: 14px !important;
    }
    .el-form-item{
      margin-bottom: 0 !important;
    }
  }

  .custom-input{
    .el-input__inner {
      border-color: red !important;
    }
  }

  .custom-collapse{
    border: none !important;
    .el-collapse-item__wrap{
      border: none !important;
    }
    .el-collapse-item__header {
      border: none !important;
      line-height: 28px;
      font-size: 12px;
      font-weight: normal;
      height: 28px;
    }
    .el-collapse-item__content {
      padding-bottom: 0;
    }
  }

  .custom-table-row{
    height: 44px !important;
  }

  .custom-statistics-tabs{
    .el-tabs__header{
      background: white;
      margin: 0;
    }
    .el-tabs__nav{
      margin-left: 20px;
      .el-tabs__item{
        font-size: 12px;
        color: #5A5D64;
      }
      .el-tabs__item.is-active {
        color: #00ADE7 !important;
        font-weight: 700;
        font-size: 14px;
      }
      .el-tabs__active-bar{
        height: 1px !important;
      }
    }
    .el-tabs__nav-wrap::after{
      height: 1px
    }
  }

  .dialog-query-item-date{
    .el-range-input{
      width: 60% !important;
    }
    .el-range-separator{
      padding: 0 4px !important;
    }
  }

  //筛选区响应式 start------------------------------
  .custom-el-button{
    padding: 9px 10px !important;
  }

  .query-item-reset{
    margin-left: 20px !important;
  }
  .query-item-reset-offset{
    margin-left: -70px !important;
  }
  .query-item-input{
    width: 270px !important;
  }
  .query-item-select{
    .el-input__inner{
      width: 270px !important;
    }
    .el-input {
      width: 270px !important;
    }
  }
  .query-item-date{
    min-width: 270px;
    max-width: 270px;
    .el-range-input{
      width: 60% !important;
    }
    .el-range-separator{
      padding: 0 4px !important;
    }
  }
  .query-item-button-group{
    min-width: 270px;
  }

  .query-item-button{
    width: 90px
  }
  @media only screen and (max-width: 1500px) {
    .query-item-reset{
      margin-left: 12px !important;
    }
    .query-item-reset-offset{
      margin-left: -58px !important;
    }
    .query-item-input{
      width: 210px !important;
    }
    .query-item-select{
      .el-input__inner{
        width: 210px !important;
      }
      .el-input {
        width: 210px !important;
      }
    }
    .query-item-date{
      min-width: 210px;
      max-width: 210px;
      .el-range-input{
        width: 50% !important;
      }
      .el-range-separator{
        padding: 0 4px !important;
      }
      .el-range__close-icon{
        width: 6px !important;
      }
    }
    .query-item-button-group{
      min-width: 210px;
    }
    .query-item-button {
      width: 70px
    }
  }

  @media only screen and (min-width: 1500px) {
    .query-item-input{
      width: 225px !important;
    }
    .query-item-select{
      .el-input__inner{
        width: 225px !important;
      }
      .el-input {
        width: 225px !important;
      }
    }
    .query-item-date{
      min-width: 225px;
      max-width: 225px;
    }
    .query-item-button-group{
      min-width: 225px;
    }
    .query-item-button {
      width: 75px
    }
  }

  @media only screen and (min-width: 1750px) {
    .query-item-input{
      width: 240px !important;
    }
    .query-item-select{
      .el-input__inner{
        width: 240px !important;
      }
      .el-input {
        width: 240px !important;
      }
    }
    .query-item-date{
      min-width: 240px;
      max-width: 240px;
    }
    .query-item-button-group{
      min-width: 240px;
    }
    .query-item-button {
      width: 80px
    }
  }

  @media only screen and (min-width: 1920px) {
    .query-item-input{
      width: 270px !important;
    }
    .query-item-select{
      .el-input__inner{
        width: 270px !important;
      }
      .el-input {
        width: 270px !important;
      }
    }
    .query-item-date{
      min-width: 270px;
      max-width: 270px;
    }
    .query-item-button-group{
      min-width: 270px;
    }

    .query-item-button{
      width: 90px
    }
  }

  //筛选区响应式 end------------------------------

  //共用价格颜色
  .price {
    color: #ff5252;
  }

  /*提示*/
  .span-help-tooltip{
    display: inline-block;
    width: 14px;
    height: 14px;
    line-height: 14px;
    text-align: center;
    border-radius: 50%;
    color: #999;
    border: 1px solid #999;
    font-size: 12px;
  }

  /*背景平铺及居中*/
  .b-b-b {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
  }

  /*穿梭框*/
  .el-transfer-panel__list {
    .el-transfer-panel__item {
      display: block !important;
      margin-left: 0px !important;
    }
  }

  .el-transfer-panel__filter {
    width: auto !important;
  }

  .el-transfer__button {
      display: block !important;
      margin: 0 auto 10px !important;
      padding: 10px !important;
      border-radius: 50% !important;
      color: #fff !important;
      font-size: 0 !important;
  }

  .el-dialog__wrapper {
    height: 100%;
  }

  .el-dialog__header {
    padding: 20px 20px 10px;
    border-bottom: 1px solid #ebeef5;
  }

  .el-dialog__title {
    font-size: 16px;
    font-weight: 500;
  }

  .el-dialog__body {
    padding-top: 20px;
  }

  /*共用搜索表单*/
  .form-search {
    padding: 15px 10px;
    margin-bottom: 15px;
    border-bottom: 1px solid #ececec;
    overflow: hidden;
    background: #fff;
  }

  /*共用表格操作按钮*/
  .table-action {
    display: flex;

    li + li {
      margin-left: 5px;
    }

    a {
      font-size: 12px;
      text-decoration: underline;
    }

    a:hover {
      font-weight: 900;
    }
  }

  /*共用表格底部操作及分页*/
  .table-bottom {
    padding-top: 12px;
    display: flex;
    align-items: center;
    position: relative;
    background-color: #fff;
  }

  .table-pagination {
    text-align: right;
    flex: 1;
  }

  .load-none {
    text-align: center;
    color: #999;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    margin-top: 48px;
  }

  .el-table.list-table {
    background-color: #fff;
  }

  .el-table .highlight-row {
    /* 旧语法，带前缀并且已经废弃，以支持老版本的浏览器 */
    /*background: -prefix-linear-zgradient(top, #FBFBFD, #F4F4F9);*/

    /* 新语法，不带前缀，以支持标准兼容的浏览器（Opera 12.1， IE 10， Firefox 16， Chrome 26， Safari 6.1） */
    background: linear-gradient(to bottom, #FBFBFD, #F4F4F9);
  }
  .el-table .stripe-row {
    /*background: #f9f9f9;*/
    background: #FBFBFD;
  }
  .el-table .default-row {
    background: #fff;
  }

  .el-table .el-table__row {
    border: none;
  }

  .el-table td, .el-table th.is-leaf {
     border-bottom: none !important;
  }

  .statistics-table-list-container{
    background: #fff;
    padding: 0 20px;
  }

  .custom-breadcrumb{
    .el-breadcrumb__inner {
      font-weight: 700 !important;
      color: #303133 !important;

      /*color: #606266;*/
    }
    .el-breadcrumb__inner.is-link, .el-breadcrumb__inner a {
      font-weight: normal !important;
      text-decoration: none !important;
      color: #606266 !important;
    }
  }

  //金额正负
  .amount{
    >.up{
      color: #F8931D;
      &::before{
        content: '+';
        margin-right: 2px;
      }
    }
    >.down{
        color: #76C627;
        &::before{
          content: '-';
          margin-right: 2px;
        }
    }
  }
